<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册页面</title>
    <script src="//unpkg.com/layui@2.9.23/dist/layui.js"></script>
    <link href="//unpkg.com/layui@2.9.23/dist/css/layui.css" rel="stylesheet">
    <style>
        .form {
            margin: 200px auto;
            width: 300px;
            height: 200px;
            box-shadow: 10px 10px 40px black;
            font-weight: 800;
            font-size: 17px;
            padding: 20px;
            color: aqua;
            background-image: url('../图片/35479210_101151731130_4.jpg');
        }

        body {
            background: url("https://iphoto.mac89.com/photo/2020/03/11/JPG-200311_304/VXkTn55FBe_small.jpg") no-repeat 0 0/cover;
        }

        .txt {
            width: 220px;
            outline: none;
            background-color: transparent;
            border: none;
            color: #1109a5;
            font-size: 16px;
        }

        h1 {
            color: #030303;
        }
    </style>
</head>

<body>
    <h1>注册页面</h1>
    <div class="form">
        用户名：<input type="text" placeholder="请输入用户名" class="txt"><br>
        <br>密&emsp;码:<input type="text" placeholder="请输入用户密码" class="txt"><br>
        <br><input type="checkbox">记住密码
        <br><input type="submit" value="注册" class="btn">
    </div>
    <script>
        var btn = document.querySelector('.btn')
        var username = document.querySelectorAll('input')[0]
        var password = document.querySelectorAll('input')[1]
        btn.addEventListener('click', () => {
            localStorage.setItem('username', username.value);
            localStorage.setItem('password', password.value);
            location.href = './login.html'
        })
    </script>
</body>

</html>